<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>vue-alain</title>
    <style type="text/css">
      .preloader{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:100%;
        overflow:hidden;
        background:#49a9ee;
        z-index:9999;
        transition:opacity .65s
      }

      .preloader-hidden-add{
        opacity:1;
        display:block
      }

      .preloader-hidden-add-active{
        opacity:0
      }
      
      .preloader-hidden{
        display:none
      }

      .cs-loader{
        position:absolute;
        top:0;
        left:0;
        height:100%;
        width:100%
      }

      .cs-loader-inner{
        transform:translateY(-50%);
        top:50%;
        position:absolute;
        width:100%;
        color:#fff;
        text-align:center
      }

      .cs-loader-inner label{
        font-size:20px;
        opacity:0;
        display:inline-block
      }

      @keyframes lol{
        0%{
          opacity:0;
          transform:translateX(-300px)
        }
        33%{
          opacity:1;
          transform:translateX(0)
        }
        66%{
          opacity:1;
          transform:translateX(0)
        }
        100%{
          opacity:0;
          transform:translateX(300px)
        }
      }
      .cs-loader-inner label:nth-child(6){
        animation:lol 3s infinite ease-in-out
      }
      .cs-loader-inner label:nth-child(5){
        animation:lol 3s .1s infinite ease-in-out
      }
      .cs-loader-inner label:nth-child(4){
        animation:lol 3s .2s infinite ease-in-out
      }
      .cs-loader-inner label:nth-child(3){
        animation:lol 3s .3s infinite ease-in-out
      }
      .cs-loader-inner label:nth-child(2){
        animation:lol 3s .4s infinite ease-in-out
      }
      .cs-loader-inner label:nth-child(1){
        animation:lol 3s .5s infinite ease-in-out
      }
    </style>
  </head>
  <body class="has-ad-rt">
    <noscript>
      <strong>We're sorry but vue-alain doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    
    <div id="app"></div>
    <div class="preloader">
      <div class="cs-loader">
        <div class="cs-loader-inner">
          <label> ●</label>
          <label> ●</label>
          <label> ●</label>
          <label> ●</label>
          <label> ●</label>
          <label> ●</label>
        </div>
      </div>
    </div>
    <!-- built files will be auto injected -->
  </body>
</html>
